<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
    <link rel="stylesheet" type="text/css" href="static/css/style.css" />
    <script type="text/javascript" src="static/js/jquery-3.3.1.min.js"></script>
    <script type="text/javascript" src="static/js/share.js"></script>
    <script type="text/javascript" src="static/js/iSlider.js"></script>
    <title>巧匠部落动态列表</title>
</head>
<body>
<div class="warp">
    <div class="install_tip_top fix">
        <div class="logo_ico"></div>
        <div class="logo"></div>
        <div class="info">中国首个工匠综合服务平台</div>
        <a class="intsll_btn" href="javascript:void(0)" onclick="share.download('http://image.qjbuluo.com/o_1da695eu21jg0j3310pbd5rtcua.apk', '')">免费安装</a>
    </div>
    <div class="video_silder_box" id="video">
        <div class="loading"></div>
    </div>
</div>
<script type="text/javascript">
    var type = share.get_param('type');
    var id = share.get_param('id');
    var current_infoid = share.get_param('current_infoid');
    var video_list = [];
    document.addEventListener('touchmove', function(e){e.preventDefault()}, false);

    function init_silder(current_index) {
        var myslider=new iSlider({
            wrap:'#video',
            item:'.video_silder',
            index: current_index,
            speed: 400,
            triggerDist: 20,
            onslide: function(index) {
                $('video')[0].pause();
                $('.video_play').show();
                $('.video_play_bg').show();
                //$('.video_silder_'+index+' video')[0].play();
                //$('.video_silder_'+index+' video').prop('autoplay', 'autoplay')
            }});
    }

    function init_video() {
        var current_index = 0;
        var html = '';
        $.each(video_list, function(index,value){
            html+='\
            <div class="video_silder video_silder_'+index+'" >\
                <div class="video_play_bg"></div>\
                <div class="video_play" onclick="play_video(this)"></div>\
                <div class="video_play_bg2" onclick="pause_video(this)"></div>\
                <video onended="complete_play(this)" poster="'+value.cover+'" preload="auto" playsinline="true" x5-video-player-type="h5"  >\
                    <source src ="'+value.videoUrl+'" type="video/mp4">\
                    Your browser does not support the video tag.\
                </video>\
                <div class="con1">\
                    <div class="textbox">\
                        <div class="bt">'+value.userName+'</div>\
                        <p>'+value.summary+'</p>\
                        <div class="dqbox">'+(value.city ? value.city : '')+'  '+(value.area ? value.area : '')+'</div>\
                    </div>\
                </div>\
                <div class="repbox">\
                    <div class="avatar" style="background-image:url('+value.userHead+')"><i class="add"></i></div>\
                    <div class="ds"></div>\
                    <div class="approve"><p>'+(value.agree > 0 ? value.agree : '')+'</p></div>\
                    <div class="chat"><p>'+(value.comment > 0 ? value.comment : '')+'</p></div>\
                    <div class="share"><p>'+(value.collect > 0 ? value.collect : '')+'</p></div>\
                </div>\
            </div>\
        ';
            if(parseInt(value.id) == parseInt(current_infoid)) {
                current_index = index;
            }
        });
        $('.video_silder_box').append(html);
        init_silder(current_index);
        init_video_bind();
    }

    function get_work_dynamics_video (id) {
        video_list = [];
        $('.loading').show();
        var obj = {
            url: share.get_api_url()+'h5/contentList/' + id,
            success: function(data) {
                if(parseInt(data.status) != 0) {
                    share.add_tip_a($('.video_silder_box'), data.msg);
                } else if (parseInt(data.status) == 0) {
                    share.remove_tip();
                    if(data.result.length > 0) {
                        $.each(data.result, function(index,value){
                            if(value.type == 2 || (value.videoUrl && value.videoUrl.length > 0 && value.cover.length > 0)) {
                                video_list.push({
                                    videoUrl: value.videoUrl,
                                    cover: value.cover,
                                    userName: value.userName,
                                    userHead: value.userHead,
                                    summary: value.summary,
                                    province: value.province,
                                    city: value.city,
                                    area: value.area,
                                    agree: value.agree,
                                    comment: value.comment,
                                    collect: value.collect,
                                    id: value.id
                                })
                            }
                        })
                        if(video_list.length > 0) {
                            init_video();
                        }
                    } else {
                        share.add_tip_a($('.video_silder_box'), '暂无数据！');
                    }
                }

            },
            complete : function() {
                $('.loading').remove();
            }
        }
        share.ajax_control(obj);
    }

    function get_userprofile_video (id) {
        video_list = [];
        $('.loading').show();
        var obj = {
            url: share.get_api_url()+'content/search',
            data: {
                userId: id
            },
            success: function(data) {
                if(parseInt(data.status) != 0) {
                    share.add_tip_a($('.video_silder_box'), data.msg);
                } else if (parseInt(data.status) == 0) {
                    share.remove_tip();
                    if(data.result.list.length > 0) {
                        $.each(data.result.list, function(index,value){
                            if(value.type == 2 || (value.videoUrl && value.videoUrl.length > 0 && value.cover.length > 0)) {
                                video_list.push({
                                    videoUrl: value.videoUrl,
                                    cover: value.cover,
                                    userName: value.userName,
                                    userHead: value.userHead,
                                    summary: value.summary,
                                    province: value.province,
                                    city: value.city,
                                    area: value.area,
                                    agree: value.agree,
                                    comment: value.comment,
                                    collect: value.collect,
                                    id: value.id
                                })
                            }
                        })
                        if(video_list.length > 0) {
                            init_video();
                        }
                    } else {
                        share.add_tip_a($('.video_silder_box'), '暂无数据！');
                    }
                }

            },
            complete : function() {
                $('.loading').remove();
            }
        }
        share.ajax_control(obj);
    }

    function play_video(obj) {
        $(obj).hide();
        $(obj).closest('.video_silder').find('.video_play_bg').hide();
        $(obj).closest('.video_silder').find('video')[0].play();
    }

    function pause_video(obj) {
        $(obj).closest('.video_silder').find('.video_play').show();
        $(obj).closest('.video_silder').find('.video_play_bg').show();
        $(obj).closest('.video_silder').find('video')[0].pause();
    }

    function complete_play(obj) {
        $(obj).closest('.video_silder').find('.video_play').show();
        $(obj).closest('.video_silder').find('.video_play_bg').show();
    }

    function init_video_bind() {
        $('.repbox').on('click', function(){
            alert('下载APP使用此功能.')
        })
    }

    if(type == 'work_dynamics') {
        get_work_dynamics_video(share.get_param('current_infoid'))
    }

    if(type == 'userprofile') {
        get_userprofile_video(share.get_param('id'))
    }
</script>
</body>
</html>
